<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/modules/cms/front/include/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta name="decorator" content="cms_default_${site.theme}"/>
	<meta name="description" content="${category.description}" />
	<meta name="keywords" content="${category.keywords}" />
	<style type="text/css">
		#main-container-fluid {
			margin-top:30px;
		}
		#main-container-fluid .container {
			width: 998px;
		}
		.span3 {
			width: 210px;
		}
		.span9 {
			width: 758px;
			float:right;
		}
		.cate_nav_top {
			width:210px;
			height:60px;
			background: url("${ctxStaticTheme}/images/cate_nav_top.png") no-repeat;
			text-align: center;
		}
		.cate_nav_top h4{
			display:inline-block;
			padding-top:20px;
			background:none;
			border: none;
			font-family: SimSun;
			color:#741624;
		}
		.cate_nav_middle {
			width:210px;
			min-height:150px;
			background: url("${ctxStaticTheme}/images/cate_nav_middle.png") repeat-y;
			text-align: center;
		}
		.cate_nav_middle ul {
			margin: 0 33px 0 32px;
			list-style: none;
		}
		
		.cate_nav_middle li {
			padding-top:5px;
			padding-bottom:5px;
			width:145px;
			height:28px;
			background: url("${ctxStaticTheme}/images/cate_nav_cell.png") no-repeat;
			font-family: SimHei;
		}
		
		.cate_nav_middle li a:hover, 
		.cate_nav_middle li a:link,
		.cate_nav_middle li a:visited,
		.cate_nav_middle li a:active {
			color: white;
			text-decoration:none;
		}
		
		.cate_nav_middle ul .menu_activ a {
			color: #efc810;
		}
		
		.cate_nav_bottom {
			width:210px;
			height:60px;
			background: url("${ctxStaticTheme}/images/cate_nav_bottom.png") no-repeat;
		}
		.cate_nav_under {
			margin-top: 100px;
			width:210px;
			height:267px;
			background: url("${ctxStaticTheme}/images/cate_nav_under.png") no-repeat;
		}
		.cate_list_top {
			width:758px;
			height:120px;
			background: url("${ctxStaticTheme}/images/cate_list_top.png") no-repeat;
			text-align: center;
		}
		.cate_list_top .cate_name {
			background: url("${ctxStaticTheme}/images/cate_logo.png") no-repeat;
			margin-left:30px;
			margin-right:30px;
			height:40px;
			padding-left:75px;
			text-align: left;
		}
		.cate_list_top .cate_name h4{
			display:inline-block;
			background:none;
			border: none;
			font-family: SimSun;
			color:#741624;
		}
		.cate_list_top .breadcrumb-container {
			margin:10px 30px 10px 30px;
			text-align: left;
		}
		.cate_list_top .breadcrumb {
			margin: 0 auto;
			background: none;
			border-top: 1px solid #c19532;
			border-bottom: 1px solid #c19532;
		}
		.cate_list_top .breadcrumb .divider {
			color: #cb1817;
		}
		.cate_list_top .breadcrumb li {
			text-shadow: none;
		}
		.cate_list_top .breadcrumb a {
			font-family: SimSun;
			color: black;
		}
		.cate_list_top .breadcrumb a:hover {
			text-decoration: none;
			color: #cb1817;
		}
		.cate_list_middle {
			width:758px;
			padding-top:15px;
			min-height:500px;
			background: url("${ctxStaticTheme}/images/cate_list_middle.png") repeat-y;
			text-align: left;
		}
		.cate_list_middle ul {
			margin: 0 30px 0 60px;
			list-style: square;
		}
		.cate_list_middle ul li {
			padding:6px 0 6px 0;
			list-style-image: url("${ctxStaticTheme}/images/cate_list_style.png");
		}
		.cate_list_bottom {
			width:758px;
			height:80px;
			background: url("${ctxStaticTheme}/images/cate_list_bottom.png") no-repeat;
		}
		.cate_list_bottom .pagination {
			margin:0 auto;
			padding-top:10px;
			text-align: center;
			background: none;
			border:none;
		}
		.cate_list_bottom .pagination ul,
		.cate_list_bottom .pagination ul>li,
		.cate_list_bottom .pagination ul>li>a, 
		.cate_list_bottom .pagination ul>li>span {
			border:none;
			color: black;
		}
		.pagination-hr {
			margin:0px 30px 0px 30px;
			border-top: 1px solid #c19532;
		}
	</style>
</head>
<body>
	<div class="row">
	   <div class="span3">
	   		<div class="cate_nav_top">
			   	 <h4>${category.name}</h4>
	   		</div>
	   		<div class="cate_nav_middle">
				 <ul>
				 	<cms:frontCategoryList categoryList="${categoryList}"/>
				 </ul>
	   		</div>
		 	<div class="cate_nav_bottom">
	   		</div>
	   		<div class="cate_nav_under"></div>
	   </div>
       <div class="span9">
       		<div class="cate_list_top">
       			<div style="height:30px;"></div>
       			<div class="cate_name">
	       			<h4>${category.name}</h4>
       			</div>
       			<div class="breadcrumb-container">
	       			<ul class="breadcrumb">
			    		<cms:frontCurrentPosition category="${category}"/>
			 		</ul>
		 		</div>
       		</div>
			<div class="cate_list_middle">
				<c:if test="${category.module eq 'article'}">
					<ul>
						<c:forEach items="${page.list}" var="article">
							<li>
								<span class="pull-right"><fmt:formatDate value="${article.updateDate}" pattern="yyyy.MM.dd" /></span>
								<a target="_blank" href="${article.url}" style="color:${article.color}">${fns:abbr(article.title,96)}</a>
							</li>
						</c:forEach>
					</ul>
				</c:if>
				<c:if test="${category.module eq 'link'}">
					<ul>
						<c:forEach items="${page.list}" var="link">
							<li><a href="${link.href}" target="_blank" style="color:${link.color}"><c:out value="${link.title}" /></a></li>
						</c:forEach>
					</ul>
				</c:if>
			</div>
			<div class="cate_list_bottom">
				<c:if test="${category.module eq 'article'}">
				<div class="pagination-hr"></div>
				<div class="pagination">${page}</div>
					<script type="text/javascript">
						function page(n, s) {
							location = "${ctx}/list-${category.id}${urlSuffix}?pageNo="	+ n + "&pageSize=" + s;
						}
					</script>
				</c:if>
			</div>
		</div>
   </div>
</body>
</html>